<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 无论外联内联, 按照顺序进行设置, 后面设置的的属性, 会把前面设置过的同名属性替换 -->
    <link rel="stylesheet" href="./style.css">
    <style>
        /* 内联样式, html css 分开, 但是在同一个页面 */
        div {
            background: yellow;
        }
    </style>   
</head>

<body>
    <div>
        <!-- 行内, css 直接卸载html 标签属性里面 -->
        <!-- 如果有行内样式, 那么行内样式的优先级最高 -->
        <div style="background: red;">
        这是一个盒子
    </div>
</body>

</html>